<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>配置管理列表</title>
    <link href="../../layui/css/layui.css" rel="stylesheet">
    <link href="../../static/css/style.css" rel="stylesheet">
    <script src="../../static/js/jquery.min.js"></script>
    <script src="../../static/js/jquery.cookie.js"></script>
    <script src="../../layui/layui.js"></script>
    <script src="../../static/js/base.js"></script>
    <script src="../../static/js/ax.js"></script>
    <script src="../../static/js/avalon.js"></script>
    <!--[if lt IE 9]>
    <script src="../../static/js/html5.js"></script>
    <script src="../../static/js/respond.js"></script>
    <![endif]-->
</head>

<body>


    <div class="layui-fluid" ms-controller="test">
        <div class="layui-card content-wrap">
            <!--查询-->
            <!--<div class="layui-form layui-card-header layuiadmin-card-header-auto">-->
            <form class="layui-form layui-form-pane">
                <div class="layui-form-item">
                    <div class="layui-row layui-col-space10">
                        <div class="layui-col-sm4">
                            <label class="layui-form-label">省份</label>
                            <div class="layui-input-block">
                                <select lay-filter="provinceSelect" id='driverprovinceId' lay-verify="required">
                                    <option value="">请选择</option>
                                    <option ms-attr="{value: el.id}" ms-for="($index, el) in @provlist">{{el.name}}</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-col-sm4">
                            <label class="layui-form-label">市区</label>
                            <div class="layui-input-block">
                                <select lay-filter="regionSelect" id='drivercityId' lay-verify="required" name="cityCode">
                                    <option value="">请选择</option>
                                    <option ms-attr="{value: el.id}" ms-for="($index, el) in @citylist">{{el.name}}</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-row layui-col-space10">
                        <div class="layui-col-sm4">
                            <label class="layui-form-label">开始时间起</label>
                            <div class="layui-input-block">
                                <input type="text" class="layui-input" id="fromTime" autocomplete="off">
                            </div>
                        </div>
                        <div class="layui-col-sm4">
                            <label class="layui-form-label">结束时间至</label>
                            <div class="layui-input-block">
                                <input type="text" class="layui-input" id="toTime" autocomplete="off">
                            </div>
                        </div>
                        <div class="layui-col-sm4">

                            <a id="doSearch" class="layui-btn add_btn">
                                <i class="layui-icon layui-icon-search"></i>搜索</a>
                            <button type="reset" class="layui-btn delete_btn">
                                <i class="layui-icon layui-icon-delete"></i>清空</button>

                        </div>

                    </div>
                </div>
            </form>


            <!--数据列表展示-->
            <div>
                <script type="text/html" id="optToolbar">
                <div style="padding-bottom: 10px;">
                   <button class="layui-btn layuiadmin-btn-useradmin add_btn" lay-event="viewRecord" id="addconfig">
                        <i class="layui-icon layui-icon-add-circle-fine"></i>   
                    新增</button>
                    <button class="layui-btn layuiadmin-btn-useradmin delete_btn" lay-event="delRecord"><i class="layui-icon layui-icon-edit"></i>编辑</button>
                </div>
            </script>

                <table class="layui-hide" id="dataListTable" lay-filter="active"></table>
            </div>


        </div>
    </div>


</body>
<script type="text/html" id="cityname">
     <div>{{d.provinceName}}-{{d.cityName}}</div> 
  </script>

<script>
    var table;
    var table;


    var vm = avalon.define({
        $id: "test",
        divisionId: '',
        cityid: '',
        fromTime: '',
        toTime: '',
        provlist: [],
        citylist: [],
        arealist: [],
        infolist: [],
        pro_city_are: {},
        //  查询省市区
        getRegionTree: function () {
            $.ajax({
                url: '../../static/js/addreess.text',  //文件地址
                type: 'GET',     //数据传递方式
                async: false,
                success: function (data) {  //获取数据成功执行的函数
                    var data = JSON.parse(data);
                    var city = data.city;
                    var area = data.area;
                    vm.provlist = data.prove;
                    vm.pro_city_are = data;
                    for (var i in city) {
                        if (city[i].parentId == data.prove[0].id) {
                            vm.citylist.push(city[i])
                        }
                    }
                    vm.cityid = city[0].id;
                    setTimeout(function () {
                        form.render('select');
                    }, 200)

                }
            })
        },
    });
    vm.$watch('onReady', function () {
        //获取省市区
        console.log(1)
        vm.getRegionTree();

    })

    layui.use(['table', 'form', 'laydate', 'layer', 'element'], function () {
        table = layui.table;

        form = layui.form;
        var $ = layui.$,
            layDateFrom = layui.laydate,
            layDateTo = layui.laydate,
            layer = layui.layer;

        // 初始化日期控件
        layDateFrom.render({
            elem: '#fromTime',
            type: "datetime"
        });
        layDateTo.render({
            elem: '#toTime',
            type: "datetime"
        });
        tableObj = ax.VTable({
            id: 'loadDataList',
            elem: '#dataListTable',
            url: govservicUrl + '/api/gov/ex/config/list',
            toolbar: '#optToolbar',
            title: '导出记录列表',
            cols: [[
                { type: 'checkbox', fixed: 'left' },
                { field: 'id', width: 80, title: '序号', fixed: 'left', type: 'numbers' },
                { title: '省市', ninWidth: 200, fixed: 'left', templet: '#cityname' },
                { field: 'configTypeName', ninWidth: 200, title: '参数配置类型' },
                { field: 'createTime', width: 200, title: '创建时间' }
            ]]

        });

        //省改变
        form.on('select(provinceSelect)', function (data) {
            vm.provinceid = data.value;
            var city = vm.pro_city_are.city;
            vm.citylist.clear();
            for (var i in city) {
                if (city[i].parentId == vm.provinceid) {
                    vm.citylist.push(city[i])
                }
            }
            vm.cityid = vm.citylist[0].id;
            form.render('select');

        });
        // 市改变
        form.on('select(regionSelect)', function (data) {
            vm.cityid = data.value;

        });



        //头工具栏事件
        table.on('toolbar()', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'delRecord':
                    var data = checkStatus.data;
                    if (data.length <= 0) {
                        layer.open({
                            title: '信息提示'
                            , content: '请选择编辑的数据！'
                        });
                        break;
                    }
                    if (data.length > 1) {
                        layer.open({
                            title: '信息提示'
                            , content: '最多选择一条数据'
                        });
                        break;
                    }
                    layer.open({
                        type: 2,
                        title: ['配置参数新增', 'font-size:18px;'],
                        shadeClose: true,
                        area: ['800px', '500px'],
                        content: 'editconfig.html?id='+data[0].id
                    });

                    break;
                case 'viewRecord':
                    layer.open({
                        type: 2,
                        title: ['配置参数新增', 'font-size:18px;'],
                        shadeClose: true,
                        area: ['800px', '500px'],
                        content: 'addconfig.html'
                    });

                    break;
            };
        });

    });


</script>

</html>